<template>
    <div>
        <el-form :model="Purchase" label-width="100px" ref="AddApplyPurchase_refs" :rules="rules">
            <el-row :gutter="10">
                <el-col :span="8">
                    <el-form-item label="采购部门" prop="DepartmentId">
                        <el-select placeholder="请选择" v-model="Purchase.DepartmentId" style="width: 100%" filterable>
                            <el-option v-for="v in AllDepartment" :label="v.DepartmentName" :value="v.Id"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
<!--                <el-col :span="8">-->
<!--                    <el-form-item label="申购人员" prop="ApplyUserId">-->
<!--                        <el-select placeholder="请选择" v-model="Purchase.ApplyUserId" style="width: 100%" filterable>-->
<!--                            <el-option v-for="v in $store.state.AllUsers" v-if="v.InternshipState!=8" :label="v.UserName" :value="v.Id"></el-option>-->
<!--                        </el-select>-->
<!--                    </el-form-item>-->
<!--                </el-col>-->
                <el-col :span="8">
                    <el-form-item label="采购人员" prop="PurchaseUserId">
                        <el-select placeholder="请选择" v-model="Purchase.PurchaseUserId" style="width: 100%" filterable>
                            <el-option v-for="v in $store.state.AllUsers" v-if="v.InternshipState!=8" :label="v.UserName" :value="v.Id"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="付款方式" prop="PayMethod">
                        <el-select placeholder="请选择" v-model="Purchase.PayMethod" style="width: 100%">
                            <el-option :value="0" label="借款"></el-option>
                            <el-option :value="1" label="对公账户"></el-option>
                            <el-option :value="2" label="电子账户"></el-option>
                            <el-option :value="4" label="备用金"></el-option>
                            <el-option :value="8" label="垫付"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="采购金额" prop="TotalPrice">
                        <el-input disabled v-model="Purchase.TotalPrice"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="垫付人" prop="AdvanceParty">
                        <el-select placeholder="请选择" filterable :disabled="Purchase.PayMethod!=8||Purchase.PayMethod==''" v-model="Purchase.AdvanceParty" style="width: 100%">
                            <el-option disable label="请选择" :value="0"></el-option>
                            <el-option v-for="v in $store.state.AllUsers" v-if="v.InternshipState!=8" :label="v.UserName" :value="v.Id"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="快递公司" prop="ExpressKey">
                        <el-select v-model="Purchase.ExpressKey" filterable style="width: 100%">
                            <el-option v-for="ex in AllExpress" :value="ex.Key" :label="ex.Name"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="快递单号" prop="ExpressNumber">
                        <el-input  v-model="Purchase.ExpressNumber"></el-input>
                    </el-form-item>
                </el-col>
<!--                <el-col :span="8">-->
<!--                    <el-form-item label="参考网址" prop="ReferenceWebsite">-->
<!--                        <el-input  v-model="Purchase.ReferenceWebsite"></el-input>-->
<!--                    </el-form-item>-->
<!--                </el-col>-->
                <el-col :span="8">
                    <el-form-item label="是否有发票" prop="IsInvoice">
                        <el-select v-model="Purchase.IsInvoice" filterable style="width: 100%">
                            <el-option :value="true" label="是"></el-option>
                            <el-option :value="false" label="否"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="采购类型" prop="PurchaseType">
                        <el-select placeholder="请选择" v-model="Purchase.PurchaseType" style="width: 100%">
                            <el-option label="办公用品" :value="1"></el-option>
                            <el-option label="生产原料" :value="2"></el-option>
                            <el-option label="仪器设备" :value="4"></el-option>
                            <el-option label="其他" :value="8"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col>
                    <el-form-item label="商品列表">
                        <el-table border stripe  :data="tableData"  ref="multipleTable">
                            <el-table-column label="名称" prop="DeviceName" align="center" show-overflow-tooltip></el-table-column>
                            <el-table-column label="规格型号" prop="DeviceModel" align="center" show-overflow-tooltip></el-table-column>
                            <el-table-column label="库存数量" prop="StockAmount" align="center"></el-table-column>
                            <el-table-column label="参考网址" prop="ReferenceWebsite" align="center"></el-table-column>
                            <el-table-column label="购买数量" prop="Amount" align="center">
                                <template slot-scope="slot">
                                    <el-input size="mini" v-model="slot.row.Amount"></el-input>
                                </template>
                            </el-table-column>
                            <el-table-column label="单位" prop="Unit" align="center"></el-table-column>
                            <el-table-column label="调研单价" prop="Unit" align="center">
                                <el-table-column label="1" prop="SurveyUnitPrice1" align="center">
                                    <template slot-scope="slot">
                                        <el-input size="mini" v-model="slot.row.SurveyUnitPrice1"></el-input>
                                    </template>
                                </el-table-column>
                                <el-table-column label="2" prop="SurveyUnitPrice2" align="center">
                                    <template slot-scope="slot">
                                        <el-input size="mini" v-model="slot.row.SurveyUnitPrice2"></el-input>
                                    </template>
                                </el-table-column>
                                <el-table-column label="3" prop="SurveyUnitPrice3" align="center">
                                    <template slot-scope="slot">
                                        <el-input size="mini" v-model="slot.row.SurveyUnitPrice3"></el-input>
                                    </template>
                                </el-table-column>
                            </el-table-column>
                            <el-table-column label="复核单价" prop="ReviewUnitPrice" align="center">
                                <template slot-scope="slot">
                                    <el-input size="mini" v-model="slot.row.ReviewUnitPrice" @blur="jiage"></el-input>
                                </template>
                            </el-table-column>
                            <el-table-column label="复核总价" prop="TotalPrice" align="center">
                                <template slot-scope="slot">
                                    {{ Allmoney(slot.row) }}
                                </template>
                            </el-table-column>
                            <el-table-column label="实际支付总价" prop="ActualPrice" align="center">
                                <template slot-scope="slot">
                                    <el-input size="mini" v-model="slot.row.ActualPrice" @blur="jiage"></el-input>
                                </template>
                            </el-table-column>
                            <el-table-column label="到货地址" prop="ArrivalAddress" align="center">
                                <template slot-scope="slot">
                                    <el-input size="mini" v-model="slot.row.ArrivalAddress"></el-input>
                                </template>
                            </el-table-column>
                            <el-table-column label="操作" align="center">
                                <template slot-scope="slot">
                                    <el-button icon="el-icon-delete" size="mini" type="danger" @click="TableRemove_event(slot.row)">删除</el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col>
                    <el-form-item label="用途说明" prop="PurchaseCause">
                        <el-input v-model="Purchase.PurchaseCause"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col>
                    <el-form-item label="关联项目" prop="ProjectId">
                        <el-select filterable v-model="Purchase.ProjectId" placeholder="请选择" style="width: 100%">
                            <el-option label="无" :value="0"></el-option>
                            <el-option v-for="v in AllProject" :label="v.ProjectName" :value="v.Id"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col>
                    <el-form-item label="供货商信息" prop="VendorInf">
                        <el-select filterable v-model="Purchase.VendorInf" placeholder="请选择" style="width: 100%">
                            <el-option label="无" :value="0"></el-option>
                            <el-option v-for="v in AllCustomer" :label="v.CustomerCompany" :value="v.Id"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col align="center">
<!--                    <el-button type="primary" @click="AddNewMaterial_dialog=true">新建物资</el-button>-->
                    <el-button type="warning" @click="AddExistingMaterial_dialog=true">导入物资</el-button>
                    <el-button type="success" @click="Submit_enent(false)">提交审核</el-button>
                    <el-button type="success" @click="Submit_enent(true)">保存为草稿</el-button>
                </el-col>
            </el-row>
        </el-form>

        <el-dialog :visible.sync="AddExistingMaterial_dialog" :modal="false" width="90%" top="10px" title="现有物资导入">
            <AddExistingMaterial :selection_-material="tableData" :all-device-state="AllDeviceState" :all-device-category="AllDeviceCategory" :all-department="AllDepartment"></AddExistingMaterial>
        </el-dialog>

        <el-dialog :visible.sync="AddNewMaterial_dialog" :modal="false" width="90%" title="新建物资导入">
            <AddNewMaterial :get-new-device="GetNewDevice" :all-department="AllDepartment"  :all-device-category="AllDeviceCategory" :all-device-state="AllDeviceState"></AddNewMaterial>
        </el-dialog>

    </div>
</template>

<script>
    import AddExistingMaterial from "../../Material/AddExistingMaterial";
    import AddNewMaterial from "../../Material/AddNewMaterial";

    export default {
        name: "AddPurchase",
        components: {
            'AddExistingMaterial': AddExistingMaterial,
            'AddNewMaterial': AddNewMaterial,
        },
        props: {
            AllDepartment: {
                type: Array,
                required: true,
            },
            AllProject: {
                type: Array,
                required: true,
            },
            AllDeviceState: {
                type: Array,
                required: true,
            },
            AllDeviceCategory: {
                type: Array,
                required: true,
            },
            AllCustomer: {
                type: Array,
                required: true,
            },
            AllExpress: {
                type: Array,
                required: true,
            },
        },
        data() {
            return {
                //采购数据实体
                Purchase: {
                    DepartmentId: '',
                    ApplyUserId: 0,
                    PurchaseUserId: '',
                    PayMethod: '',
                    AdvanceParty: 0,
                    TotalPrice: 0,
                    PurchaseCause: '',
                    ProjectId: 0,
                    VendorInf: 0,
                    ExpressKey:'',
                    ExpressNumber:'',
                },
                //商品列表
                tableData: [],
                //商品列表替换数组
                tableData_: [],
                //物资列表弹框
                AddExistingMaterial_dialog: false,
                //新建物资弹框
                AddNewMaterial_dialog: false,
                //新建物资
                NewDevice: 0,
                //认证
                rules: {
                    DepartmentId:[  { required: true, message: '请选择申购人员', trigger: 'change' }],
                    ApplyUserId:[ { required: true, message: '请选择申购人员', trigger: 'change' }],
                    PurchaseUserId:[ { required: true, message: '请选择采购人员', trigger: 'change' }],
                    PayMethod:[ { required: true, message: '请选择付款方式', trigger: 'change' }],

                    IsInvoice:[ { required: true, message: '请选择是否有发票', trigger: 'change' }],
                    PurchaseType:[ { required: true, message: '请选择采购类型', trigger: 'change' }],
                },
                //快递公司数据
            }
        },
        methods: {
            //表格数据移除
            TableRemove_event(obj) {
                this.tableData.forEach((item, i) => {
                    if (item.DeviceId == obj.DeviceId) {
                        this.Purchase.TotalPrice -= obj.TotalPrice
                        this.tableData.splice(i, 1)
                    }
                })
            },
            //单个物品总价
            Allmoney(obj) {
                let newmonry = obj.ReviewUnitPrice * obj.Amount
                if (isNaN(newmonry)) {
                    obj.TotalPrice = 0
                } else {
                    obj.TotalPrice = newmonry
                }
                return obj.TotalPrice.toFixed(2)
            },
            //提交审核
            Submit_enent(isDraft) {
                this.$refs['AddApplyPurchase_refs'].validate(vali=>{
                    if (vali){
                        if (this.tableData.length == 0) {
                            this.$message.warning('物资列表不可为空')
                            return
                        }
                        let result = true
                        for (let i = 0; i < this.tableData.length; i++) {
                            if (this.tableData[i].DeviceName == "" || this.tableData[i].DeviceModel == "" || this.tableData[i].Amount == "" || this.tableData[i].ReviewUnitPrice == "" || (this.tableData[i].TotalPrice == "" && this.tableData[i].ActualPrice == "")) {
                                this.$message.warning('物资列表名称：' + this.tableData[i].DeviceName + "，其中一些必填数据不能为空")
                                result = false
                                return;
                            }
                            if(!this.tableData[i].DeviceId && this.tableData[i].DeviceId !== 0){
                                this.tableData[i].DeviceId = this.tableData[i].Id;
                                this.tableData[i].Id = 0;
                            }
                        }
                        if (result) {
                            let loadding = this.openLoading();
                            let url = isDraft ? "Purchase/SavePurchaseContentDraft" : "Purchase/AddPurchaseContent";
                            this.$http.post(url, {
                                purchase: this.Purchase,
                                addPurchase: this.tableData
                            }).then(res => {
                                loadding.close();
                                if (res.data.IsSuccess) {
                                    this.$message.success('添加成功')
                                    this.$parent.$parent.AddPurchase_dialog = false
                                    this.$parent.$parent.formdata()
                                } else {
                                    this.$message.warning('添加失败')
                                }
                            }).catch(() => {
                                loadding.close();
                                this.$message.error('服务器异常,请联系管理员!')
                            })
                        }
                    }
                })
            },
            //获取新建的物资
            GetNewDevice(NewDevice_) {
                NewDevice_.DeviceId = NewDevice_.Id
                NewDevice_.Id = 0 //重置为0，父页面用来判断是否是新增物资
                NewDevice_.ActualPrice=0
                this.tableData.push(NewDevice_)
                this.AddNewMaterial_dialog = false
            },
            //表格数据重置
            Fromreset() {
                this.$refs['AddApplyPurchase_refs'].resetFields()
                this.tableData = []
            },
            //总价计算
            jiage() {
                let newdata = 0
                this.tableData.forEach(d => {
                    if (parseFloat(d.ActualPrice)>0){
                        newdata += parseFloat(d.ActualPrice)
                    }else{
                        newdata += parseFloat(d.TotalPrice)
                    }
                })
                this.Purchase.TotalPrice = newdata
            }
        }
    }
</script>

<style scoped>

</style>
